<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity3">
<head>
    <meta charset="UTF-8" />
    <title>Blog</title>

    <script th:src="|https://code.jquery.com/jquery-1.12.4.min.js|"></script>
    <script th:src="|https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js|"></script>
    <script th:src="|https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js|"></script>
    <link rel="stylesheet" th:href="|https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css|"/>
    <script src="../public/js/contact_me.js" th:src="@{/js/contact_me.js}"></script>
    <link rel="stylesheet" href="../public/css/styles.css" th:href="@{/css/styles.css}" />


</head>
<body>
<header th:replace="layout :: site-header"/>

<div class="container">
    <h3>Welcome <span sec:authentication="principal.username">User</span> to the Amazon Redshift Job Posting example app</h3>
    <p>Now is: <b th:text="${execInfo.now.time}"></b></p>
    <div  id ="progress"  class="progress">
        <div class="progress-bar progress-bar-striped progress-bar-animated" style="width:90%">
            Retrieving Amazon Redshift Data...
        </div>
    </div>
    <div class="row">
        <div class="col-8">

            <div class="clearfix mt-40">
                <ul class="xsearch-items">
                </ul>
            </div>

        </div>
        <div class="col-4">

            <label for="lang">Select a Language:</label>
            <select name="lang" id="lang">
                <option>English</option>
                <option>French</option>
                <option>Spanish</option>
                <option>Russian</option>
                <option>Chinese</option>
                <option>Japanese</option>
            </select>


            <div>
                <button type="button" onclick="getPosts(5)">Five Posts</button>
                <button type="button" onclick="getPosts(10)">Ten Posts</button>
                <button type="button" onclick="getPosts(0)">All Posts</button>
            </div>
        </div>
    </div>
</body>
</html>
